<template>
  <div>
    <div class="cm-tit mt20 clearfix">
      <el-form :ref="reffrom" :inline="true" :model="params" class="demo-form-inline">
        <el-form-item v-for="(item, i) of data" :key="i" :label="item.label" :prop="item.props">
          <el-input v-show="item.type == 'input'" v-model.trim="params[item.props]" clearable :placeholder="item.placeholder" />
          <el-input v-show="item.type == 'inputNumber'" v-model.trim="params[item.props]" :placeholder="item.placeholder" @input="params[item.props] = params[item.props].replace(/[^\d]/g, '')" />

          <div>
            <el-select v-show="item.type == 'options'" v-model.trim="params[item.props]" :placeholder="item.placeholder" clearable @change="duduxia(params[item.props])">
              <el-option v-for="(item1, y) of item.optionsdata" :key="y" :label="item1.label" :value="item1.value" />
            </el-select>
          </div>
          <div>
            <el-date-picker v-show="item.type == 'datetimerange'" v-model.trim="params[item.props]" :type="item.type" range-separator="至" value-format="yyyy-MM-dd HH:mm:ss" start-placeholder="开始日期" end-placeholder="结束日期" />
          </div>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="query">查询</el-button>
          <el-button @click="resetForm">重置</el-button>
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>

<script>
export default {
  props: ['cpnfromdata', 'reffrom'],
  data() {
    return {
      data: [],
      rules: [],
      params: {
        // orderNo:"",
        // duduxia:'123123'
      }
    }
  },
  mounted() {
    this.data = this.cpnfromdata
  },
  methods: {
    duduxia(aaa) {
      console.log(aaa)
    },
    query() {
      this.$emit('fromquery', this.params)
    },
    resetForm(formName) {
      this.params = {}
      console.log(this.params)
      this.$emit('fromquery', this.params)
      console.log(formName)
    }
  }
}
</script>

<style></style>
